.px2rem(@name, @px) {
    @{name}: @px / 75 * 1rem;
}

body {
    background: #efeff4;
}
.header{
    width: 100%;
    .px2rem(height,100);
    .px2rem(margin-top,50);
    display: flex;
    justify-content: flex-end;
    align-items: center;
    background-image: url(../img/bg-ju.png);
    background-size: 100% 100%;
    span{
       display: block;
       .px2rem(width,56);
       .px2rem(height,56);
       .px2rem(line-height,50);
       text-align: center;
       border: 1px solid #969696;
       border-radius: 100%;
       color: #969696;
       .px2rem(font-size,50);
       font-weight: bolder;
       .px2rem(margin-right,30);
    }
}

.logo{
    width: 100%;
    .px2rem(margin-top,60);
    display: flex;
    justify-content: center;
    align-items: center;
    span{
        .px2rem(width,205);
        .px2rem(height,205);
        border: 3px solid white;
        border-radius: 100%;
        background-image: url(../img/tao.png);
        background-size: 100% 100%;
        overflow: hidden;
        p{
            text-align: center;
            .px2rem(height,50);
            background: #7f2100;
            .px2rem(line-height,50);
            color: white;
            .px2rem(font-size,20);
            margin-top: 76%;
        }
    }
}

.page{
    width: 100%;
    .px2rem(height,100);
    text-align: center;
    .px2rem(line-height,100);
    .px2rem(font-size,26);
    font-weight: bolder;
}
.huo{
    width: 100%;
    .px2rem(height,100);
    text-align: center;
    .px2rem(line-height,100);
    background-image: url(../img/bg-huo.png);
    background-size: 100% 100%;
    .px2rem(font-size,32);
    font-weight: bolder;
    color: #969696;
}
.inp{
    width: 100%;
    .px2rem(height,180);
    .ipt_text{
        margin: 0 auto;
        width: 96%;
        height: 100%;
        background: white;
        border-radius: 10px;
        p{
            width: 100%;
            height: 50%;
            display: flex;
            span{
                .px2rem(width,100);
                height: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                img{
                   .px2rem(width,50);
                   .px2rem(height,50);
                }
            }
            input{
                flex: 1;
                border: none;
                outline: none;
                border-bottom: 1px solid #CCCCCC;
                border-top-right-radius: 10px;
                .px2rem(font-size,30);
            }
            
        }
        p:nth-child(2){
           input{
               border: none;
               border-bottom-right-radius: 10px;
               background: url(../img/yan.png) no-repeat right 10px center;
               background-size: 5%;
           } 
        }
    }
}
.btn{
    width: 100%;
    .px2rem(height,100);
    .px2rem(margin-top,20);
    text-align: center;
    button{
        width: 96%;
        height: 100%;
        color: white;
        .px2rem(font-size,40);
        border: none;
        font-weight: bolder;
        outline: none;
        background: #e61414;
        border-radius:10px;
    }
}

.Prompt{
    width: 100%;
    .px2rem(height,100);
    .px2rem(line-height,100);
    display: flex;
    justify-content: space-between;
    .px2rem(font-size,26);
    span:nth-child(1){
        .px2rem(padding-left,18);
        color: #626771;
    }
    span:nth-child(2){
        .px2rem(padding-right,18);
        color: #9b9b9b;
    }
}
.register{
    width: 100%;
    .px2rem(margin-top,50);
    text-align: center;
    button{
        width: 30%;
        .px2rem(height,66);
        border: none;
        border: 1px solid #ff5000;
        outline: none;
        border-radius: 5px;
        color: #828282;
        background: #efeff4;
        .px2rem(font-size,30);
        
    }
}
